import React, { useState,forwardRef, useImperativeHandle}  from "react";

import {notification,PageHeader, Button,Steps,Tag} from 'antd'

import commonConfig from "static/js/commonConfig";

const { Step } = Steps;

const {getStatusIndex,statusValue,getStatusJurisdiction} = commonConfig

const LlxHead = forwardRef((props, ref) => {

  const {form,userName,role,examineStatus,statusType,nameType} = props

  const formItem  = form.getFieldValue()

  useImperativeHandle(ref, () => ({
    current
  }));

  const [current,setCurrent] = useState(getStatusIndex(formItem[statusType]))

  const changeStatus = (current) => {
    const data = getStatusJurisdiction(formItem[statusType],formItem.createBy,formItem.rmanager,formItem.qmanager,userName,role)

    if(!data.includes(statusValue(current,formItem[statusType]))) {
      const text = data.length?data.join(' + '):'无'
      notification.error({
        message: '不可切换该状态，你当前可选择得状态:' + text,
        description: '操作人：' + userName,
        duration:2
      });
      return
    }

    setCurrent(current)

  }
  


  return <div className="head-info">
    
    <PageHeader
      ghost={false}
      title={formItem[nameType]}
      subTitle={<div>创建人 : {formItem.createBy} &nbsp;&nbsp;更新人 : {formItem.updateBy}<br></br>负责人 : {formItem.rmanager||formItem.qmanager||'无'} &nbsp;&nbsp;更新时间 : {formItem.updateTime}</div>}
      extra={!examineStatus?[
        <Button key="2" onClick={props.getMore}>更多信息</Button>,
        <Button key="1" type="primary" onClick={props.preservationData}>
          保存
        </Button>,
      ]:[<Button key="2" onClick={props.getMore}>更多信息</Button>]}
    >

  
{
       examineStatus&&!form.getFieldValue().wordName?<div className="info-status">
         {form.getFieldValue().upperLower===1010?<Tag color="success">发布状态</Tag>:(form.getFieldValue().upperLower===1000?<Tag color="error">已下架</Tag>:<Tag color="error">未知</Tag>)}
       </div>:''
    }
     
    {
       !examineStatus?<div className="head-status">
        {
          ['N','R','Q'].includes(formItem[statusType])?(
           <Steps style={{width:'400px',marginTop:'22px'}}  current={current} onChange={changeStatus}>
           <Step title="N" />
           <Step title="R" />
           <Step title="Q" />
           <Step title="P" />
         </Steps>
          ):(
           <Steps style={{width:'400px',marginTop:'22px'}}  current={current} onChange={changeStatus}>
           <Step title="PN" />
           <Step title="PR" />
           <Step title="PQ" />
           <Step title="P" />
         </Steps>
          )
        }
       </div>:''
    }
       
    
    </PageHeader>
  </div>
})

export default LlxHead